<template>
    <div id="download-btn-box">
        <v-btn
                height="40px"
                outlined
                color="warning"
                @click="download()"
                :disabled="disabled"
                :loading="loading"
        >
            下载
        </v-btn>
    </div>
</template>

<script>
    export default {
        name: "DownloadBtn",
        data() {
            return {
                loading: false
            }
        },
        methods: {
            download() {
                let _this = this;
                _this.loading = true;
                _this._get({
                    url: 'system/disk/get-file-download-url',
                    params: {
                        key: _this.$store.state.selected[0].key,
                        name: _this.$store.state.selected[0].name
                    }
                }).then((rsp) => {
                    if (rsp.data.code === '00000') {
                        let url = rsp.data.object;
                        let link = document.createElement("a");
                        link.href = url;
                        link.style.display = "none"
                        let box = document.getElementById("download-btn-box");
                        box.appendChild(link);
                        link.click();
                        box.removeChild(link);
                        _this.$store.commit("setSelected", [])
                    } else {
                        _this.$serverError();
                        2
                    }
                }).catch((error) => {
                    console.log(error)
                    _this.$serverError();
                }).finally(() => {
                    _this.loading = false;
                })
            }
        },
        computed: {
            disabled() {
                return (this.$store.state.selected.length !== 1 || this.$store.state.selected[0].type === "folder");
            }
        }
    }
</script>

<style scoped>

</style>